import os
#命令行输入python create-url.py

# 读取文件夹所有图片的相对路径
def read_file_name(file_dir):
    file_list=[]
    for root, dirs, files in os.walk(file_dir):
        for f in files:
            file_list.append(root+'\\'+f)
    return file_list

# 使用模板生成html
def htmlMuban(title,file_list):
    muban='''<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图床——'''+title+'''</title>
    <style>
        .images-list{
            display: flex;
            flex-wrap: wrap;
            /*align-items: center;*/
            justify-content: center;
        }
        img{
            width:400px;
            padding: 10px;
            margin: 10px;
            background-color: #ddd;
        }
        h4{
            text-align: center;
        }
    </style>
</head>
<body>
<h1 style="text-align: center;">佛大新生小助手图库——'''+title+'''</h1>
<div id="images" class="images-list">

</div>
<script>
    let imagesList='''+str(file_list)+''';
    for(let i=0;i<imagesList.length;i++) {
        document.getElementById("images").insertAdjacentHTML('beforeend', '<div><h4>'+(i+1)+'、'+imagesList[i]+'</h4><img src="'+imagesList[i]+'"></div>');
    }
</script>
</body>
</html>
'''
    return muban

def createHtml(fileName,title,file_list):
    htmlFile = open(fileName, 'w', encoding='utf-8')
    htmlFile.write(htmlMuban(title, file_list))
    htmlFile.close()

def createIndex():
    muban='''<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>图床</title>
    <style>
        .images-list{
            display: flex;
            flex-wrap: wrap;
            /*align-items: center;*/
            justify-content: center;
        }
        img{
            width:400px;
            padding: 10px;
            margin: 10px;
            background-color: #ddd;
        }
        h4{
            text-align: center;
        }
        h1{
            margin-bottom: 50px;
            text-align: center;
        }
        h2{
            text-align: center;
            margin-top: 50px;
        }
        a{
            padding: 20px;
            background-color: #eee;
            margin: 20px;
        }
    </style>
</head>
<body>
<h1>佛大新生小助手图库</h1>
<a href="jiao-xue-zhou-li.html">教学周历</a>
<a href="ji-gou.html">学校机构</a>
<a href="she-tuan.html">学校社团</a>
<a href="gong-zong-hao.html">公众号</a>
<a href="map.html">校园地图</a>
<a href="tong-xiang-hui.html">同乡会</a>
<a href="su-she.html">宿舍</a>
<a href="xin-sheng-qun.html">新生群</a>
<h2>首页轮播图</h2>
<div id="images" class="images-list">

</div>
<script>
    let imagesList='''+str(read_file_name('indexImages'))+'''
    for(let i=0;i<imagesList.length;i++) {
        document.getElementById("images").insertAdjacentHTML('beforeend', '<div><h4>'+(i+1)+'、'+imagesList[i]+'</h4><img src="'+imagesList[i]+'"></div>');
    }
</script>
</body>
</html>'''
    htmlFile = open('index.html', 'w', encoding='utf-8')
    htmlFile.write(muban)
    htmlFile.close()

# 生成首页
createIndex()

# 生成教学周历
createHtml(fileName='jiao-xue-zhou-li.html',
           title='教学周历',
           file_list=read_file_name('zhouli'))

# 生成学校机构
createHtml(fileName='ji-gou.html',
           title='学校机构',
           file_list=read_file_name('jigou'))


# 生成学校社团
createHtml(fileName='she-tuan.html',
           title='学校社团',
           file_list=read_file_name('shetuan'))

# 生成公众号
createHtml(fileName='gong-zong-hao.html',
           title='公众号',
           file_list=read_file_name('gongzonghao'))

#生成校园地图
createHtml(fileName='map.html',
           title='校园地图',
           file_list=read_file_name('map'))

#生成宿舍
createHtml(fileName='su-she.html',
           title='宿舍',
           file_list=read_file_name('sushe'))

# 生成同乡会
createHtml(fileName='tong-xiang-hui.html',
           title='同乡会',
           file_list=read_file_name('tongxianghui'))

#生成新生群
createHtml(fileName='xin-sheng-qun.html',
           title='新生群',
           file_list=read_file_name('xinshengqun'))
